<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<!-- 主体内容 -->
<div class="layui-fluid" >



    <form class="layui-form" id="form1">
        <div class="layui-card">
            <div class="layui-card-body">
                <div class="layui-card-header"  style="color:#d02e25;font-family: '楷体'; ">
                    添加课程
                </div>


                <div class="layui-form-item layui-form-text">
                    <label class="layui-form-label">课程名称</label>
                    <div class="layui-input-inline">
                        <input type="text" name="name"  lay-verify="required"
                               autocomplete="off" class="layui-input">
                    </div>

                    <label class="layui-form-label">来源</label>
                    <div class="layui-input-inline">
                        <input type="text" name="theSource"  lay-verify="required"
                               autocomplete="off" class="layui-input">
                    </div>

                    <label class="layui-form-label">上传单位</label>
                    <div class="layui-input-inline">
                        <div class="layui-inline" style="width: 100%;">

                            <div class="layui-input-inline" style="width: 100%;">
                                <select name="uploadUnit" id="uploadUnit" lay-verify="required" lay-search="" style="width: 100%;">

                                </select>
                            </div>
                        </div>
                    </div>

                </div>


                <div class="layui-form-item">
                    <label class="layui-form-label">上传时间</label>
                    <div class="layui-input-inline">
                        <input type="text" name="uploadDate" id="uploadDate" lay-verify="required"
                               autocomplete="off" class="layui-input">
                    </div>

                    <label class="layui-form-label">审核时间</label>
                    <div class="layui-input-inline">
                        <input type="text" name="checkDate" id="checkDate" lay-verify="required"
                               autocomplete="off" class="layui-input">
                    </div>
                </div>



                <div class="col-sm-3 text-right" style="line-height: 35px;"><label>封面缩略图：</label> </div>
                <div class="col-sm-9 " style="margin-bottom: 20px;">
                    <div class="layui-input-block">
                        <button style="margin-left: -111px;" type="button" class="layui-btn" id="uploadImgBtn">上传缩略图</button>
                        <div class="layui-upload-list" style="margin-top: -47px;">
                            <img class="layui-upload-img" style="height: 50px;" id="uploadImg"/>
                            <p id="uploadImgText"></p>
                        </div>
                        <input type="hidden" name="icon" value="" required/>
                    </div>
                </div>

                <div class="layui-form-item">
                    <label class="layui-form-label">&nbsp;</label>
                    <div class="layui-input-block">
                        <input type="checkbox" name="typeOne" id="typeOne" title="是否属于一类">
                        <input type="checkbox" name="typeTwo" id="typeTwo" title="是否属于二类">
                        <input type="checkbox" name="status" id="status" title="是否开设">
                        <input type="checkbox" name="ispublic" id="ispublic" title="是否公开">
                    </div>
                </div>


                <div class="layui-form-item layui-upload">
                    <label class="layui-form-label layui-btn layui-btn-normal" id="files">选择附件</label>
                    <div class="layui-input-block">
                        <div class="layui-upload-list">
                            <table class="layui-table">
                                <thead>
                                <tr><th>文件名</th>
                                    <th>大小</th>
                                    <th>状态</th>
                                    <th>操作</th>
                                </tr></thead>
                                <tbody id="demoList"></tbody>
                            </table>
                        </div>
                    </div>
                </div>






                <div class="layui-form-item" style="margin-left: 440px;">
                    <div class="layui-input-block">
                        <button class="layui-btn" lay-submit lay-filter="ok" id="submit">提交</button>
                        <button type="reset" class="layui-btn layui-btn-primary" id="reset">重置</button>
                    </div>
                </div>


            </div>
        </div>
    </form>


</div>



<script type="application/javascript">
    // layui.use(['form','laydate'], function(){

    var form = layui.form;
    var laydate = layui.laydate;
    var upload = layui.upload;
    var fileNames;


    //时间戳
    var nowtimestamp = (new Date()).getTime();
    //执行一个laydate实例



    laydate.render({
        elem: '#uploadDate'
    });

    laydate.render({
        elem: '#checkDate'
    });


    form.render();
    //提交信息
    form.on('submit(ok)',function (data) {
        console.log(data.field);
        //将数据转换成是否
        if(data.field.typeOne=="on"){
            data.field.typeOne = 1;
        }else{
            data.field.typeOne = 0;
        }

        if(data.field.typeTwo=="on"){
            data.field.typeTwo =1;
        }else{
            data.field.typeTwo = 0;
        }

        if(data.field.ispublic=="on"){
            data.field.ispublic = 1;
        }else{
            data.field.ispublic = 0;
        }

        if(data.field.status=="on"){
            data.field.status = 1;
        }else{
            data.field.status = 0;
        }


        console.log(data.field);
        $.ajax({
            type:"post",
            url:"/ajax/party/admin/addlesson",
            contentType : 'application/json;charset=utf-8',
            //设置请求头信息
            dataType:"json",
            data:JSON.stringify(data.field),
            success:function (res) {
                if(res.code==0){
                    layer.alert("OK");
                }else {
                    layer.alert("发生了一些小错误，提交失败！");
                }
            }
        })

        return false;
    })
    // });

</script>

<script>
    //显示搜索选择框

    $.post("/ajax/party/admin/branches",{
        check:1024
    },function (res) {
        if(res.code==0){
            //得到所有级别
            var names = new Array();
            for(var i=0;i<res.data.length;i++){
                names[i]=res.data[i].branchName;
            }
            //将等级动态显示到界面上
            for(var i=0;i<names.length;i++){
                document.getElementById("uploadUnit").options.add(new Option(names[i],names[i]));

            }

        }
        else{
            layer.alert("未知错误！");
        }
        form.render();
    });


</script>

<%--//文件上传--%>
<script type="application/javascript">
    var imgPath;
    //上传缩略图
    var uploadInst = upload.render({
        elem:'#uploadImgBtn'  //绑定元素
        ,url:'/api/spfile/upload'  //上传接口
        ,data:{
            tableName: '视频表',
            index:nowtimestamp
        }
        ,before: function(obj){
            obj.preview(function(index, file, result){
                $('#uploadImg').attr('src', result);

            });
        }
        ,done:function (res) {
            $("input[name=icon]").val(res.url);
            imgPath = res.url;
            console.log(imgPath);
        }
        ,error:function () {
            alert("nono");
        }
    });

    //允许上传的文件类型
    var filetype = "";
    //获取允许上出的文件类型
    $.post("/ajax/pub/getfile-type", {}, function (result) {
        for(i =0; i < result.length; i++){
            if(result[i].type == null || result[i].type == ""){
                continue;
            }else {
                filetype = filetype + result[i].type + "|";
            }
        }
    });
    //多文件列表
    var demoListView = $('#demoList')
        ,uploadListIns = upload.render({
        elem: '#files'
        ,url: '/api/spfile/upload'
        ,data: {
            tableName: '课程表',
            index: nowtimestamp
        }
        ,accept: 'file'
        ,acceptMime: filetype
        ,multiple: true
        ,number: 100
        ,auto: false
        ,bindAction: '#submit'
        ,choose: function(obj){
            var files = this.files = obj.pushFile(); //将每次选择的文件追加到文件队列
            fileNames = files;
            // console.log(files);
            //读取本地文件
            obj.preview(function(index, file, result){
                // console.log(file.name);
                var tr = $(['<tr id="upload-'+ index +'">'
                    ,'<td>'+ file.name +'</td>'
                    ,'<td>'+ (file.size/1014).toFixed(1) +'kb</td>'
                    ,'<td>等待上传</td>'
                    ,'<td>'
                    ,'<button class="layui-btn layui-btn-xs demo-reload layui-hide">重传</button>'
                    ,'<button class="layui-btn layui-btn-xs layui-btn-danger demo-delete">删除</button>'
                    ,'</td>'
                    ,'</tr>'].join(''));

                //单个重传
                tr.find('.demo-reload').on('click', function(){
                    obj.upload(index, file);
                });

                //删除
                tr.find('.demo-delete').on('click', function(){
                    delete files[index]; //删除对应的文件
                    tr.remove();
                    uploadListIns.config.elem.next()[0].value = ''; //清空 input file 值，以免删除后出现同名文件不可选
                });

                demoListView.append(tr);
            });
        }
        ,done: function(res, index, upload){
            if(res.code == 0){ //上传成功
                var tr = demoListView.find('tr#upload-'+ index)
                    ,tds = tr.children();
                console.log(tds.eq(0).prevObject[0].childNodes[0].data);
                var videoName = tds.eq(0).prevObject[0].childNodes[0].data;
                var lessonName = $("input[name='name']").val();
                var videoPath = res.url;
                console.log(res.url);
                console.log(imgPath);
                $.post("/ajax/party/admin/savevideo",{
                    videoName:videoName,
                    lessonName:lessonName,
                    imgPath:imgPath,
                    videoPath:videoPath
                },function (res) {
                    if(res.code!=0){
                        layer.alert("保存失败");
                    }
                })
                tds.eq(2).html('<span style="color: #5FB878;">上传成功</span>');
                tds.eq(3).html(''); //清空操作

                return delete this.files[index]; //删除文件队列已经上传成功的文件
            }else if(res.code == -1) {
                layer.msg("文件类型不支持");
            }
            this.error(res, index, upload);
        }
        ,error: function(res, index, upload){
            var tr = demoListView.find('tr#upload-'+ index)
                ,tds = tr.children();
            if(res.code == -1){
                tds.eq(2).html('<span style="color: #FF5722;">文件类型不支持</span>');
            }else {
                tds.eq(2).html('<span style="color: #FF5722;">上传失败</span>');
            }
            tds.eq(3).find('.demo-reload').removeClass('layui-hide'); //显示重传
        }
    });

</script>



